import { Card, Form, Input } from 'antd';
import React, { useContext } from 'react';
import FlowContext from '@/pages/Flow/FlowContext';

const { Item } = Form;

function ProcessBasicInfoPanel({ form }) {
  const { getFieldDecorator } = form;
  const { state } = useContext(FlowContext);
  const { processCode, processName, processVersionNumber } = state;

  return (
    <Card type="inner" size="small" title="流程基本信息" bordered={false}>
      <Form>
        <Item label="流程名称">
          {getFieldDecorator('processName', {
            initialValue: processName,
          })(<Input placeholder="请输入" disabled />)}
        </Item>
        <Item label="流程编码">
          {getFieldDecorator('processCode', {
            initialValue: processCode,
          })(<Input placeholder="请输入" disabled />)}
        </Item>
        <Item label="流程版本">
          {getFieldDecorator('processVersionNumber', {
            initialValue: processVersionNumber,
          })(<Input placeholder="请输入" disabled />)}
        </Item>
      </Form>
    </Card>
  );
}

export default Form.create()(ProcessBasicInfoPanel);
